<template>
	<view>
		<view class="tips">提示：为了做好新型冠状病毒感染肺炎的防控，请全校教职工和学生按要求如实填写身体状况，感谢配合！</view>
		<view class="user">
			<picker mode="date" :value="date" @change="bindDateChange" class="dateBox">
				<view>
					{{ date }}
					<!-- <icon class="iconfont iconarrow-right-copy-copy"></icon> -->
					<icon class="arrow"></icon>
				</view>
			</picker>
			<!-- <pickerModule :picker="item" v-for="(item, index) in picker" :key="index" @pickerChange="pickerChange"></pickerModule> -->
			<text v-text="user.name"></text>
		</view>
		<baseForm :column.sync="column" @submitFun="submitFun" :button="button" class="formStyle" ><view class="refresh" @click="getLocation">刷新</view></baseForm>
	</view>
</template>

<script>
import baseForm from '@/wxcomponents/form/form.vue';
import pickerModule from '@/wxcomponents/form/picker.vue';
import common from '@/libs/login.js';
import { format, dictCode } from '@/libs/common.js';
import QQMapWX from '@/libs/qqmap/qqmap-wx-jssdk.js';
import { mapActions } from 'vuex';
import graceChecker from '@/js_sdk/graceui-dataChecker/graceChecker.js';
export default {
	data() {
		let that = this;
		return {
			user: '',
			button: {
				hide: false
			},
			date: format('YY-mm-dd', new Date()),
			column: [
				{
					label: '1.当前所在地（自动获取）',
					value: '',
					required: true,
					disabled: true,
					type: 'normalInput',
					name: 'location'
				},
				{
					label: '2.今日体温', //dict_health_temperature
					value: 1,
					required: true,
					name: 'temperature',
					type: 'radio',
					disabled: false,
					items: [
						{
							value: 1,
							name: '正常'
						},
						{
							value: 2,
							name: '发烧(37.3°及以上)'
						}
					]
				},
				{
					label: '3.今日身体是否出现以下症状', //dict_health_symptom
					value: 9,
					required: true,
					name: 'symptom',
					type: 'radio',
					disabled: false,
					items: [
						{
							value: 1,
							name: '感冒'
						},
						{
							value: 2,
							name: '咳嗽'
						},
						{
							value: 3,
							name: '嗓子痛（咽痛）'
						},
						{
							value: 4,
							name: '胸闷'
						},
						{
							value: 5,
							name: '呼吸困难'
						},
						{
							value: 6,
							name: '恶心呕吐'
						},
						{
							value: 7,
							name: '腹泻'
						},
						{
							value: 8,
							name: '其他症状'
						},
						{
							value: 9,
							name: '无任何症状'
						}
					]
				},
				{
					label: '4.症状描述',
					placeholder: '请输入您要说明的内容',
					name: 'symptomDesc',
					type: 'textarea',
					disabled: false,
					required: false,
					value: '',
					text: ''
				},
				{
					label: '5.是否住校', //dict_health_living_school
					value: 1,
					// required: true,
					name: 'isLivingSchool',
					type: 'radio',
					disabled: false,
					items: [
						{
							value: 1,
							name: '是'
						},
						{
							value: 2,
							name: '否'
						}
					]
				},
				{
					label: '6.居住楼栋（x栋x单元-房间号）',
					placeholder: '请输入您要说明的内容',
					name: 'buildingArea',
					type: 'textarea',
					disabled: false,
					required: false,
					value: '',
					text: ''
				},
				{
					label: '7.家属人数',
					placeholder: '请输入您要说明的内容',
					name: 'familyNumbers',
					type: 'textarea',
					disabled: false,
					required: false,
					value: '',
					text: ''
				},
				{
					label: '8.家属体温及身体情况', //dict_health_family_temperature
					value: 1,
					// required: true,
					name: 'familyTemperature',
					type: 'radio',
					disabled: false,
					items: [
						{
							value: 1,
							name: '全部正常'
						},
						{
							value: 2,
							name: '异常'
						}
					]
				},
				{
					label: '9.家属症状描述（异常）',
					placeholder: '请输入您要说明的内容',
					name: 'familySymptomDesc',
					type: 'textarea',
					disabled: false,
					required: false,
					value: '',
					text: ''
				}
			],
			submitDisable: true
		};
	},
	async onLoad() {
		this.user = await common.getStorage('user');
		this.getLocation();
		this.setClassName('blue');
		this.getRecord();
	},
	async onShow() {},
	methods: {
		...mapActions(['setClassName']),
		//改变日期
		bindDateChange(e) {
			this.date = e.detail.value
		},
		//获取当日记录
		async getRecord() {
			let resp = await this.$http.post({
				url: `/oa/healthReport/querySelf?reportDate=${this.date}`
				// url: `/oa/healthReport/querySelf`
			});
			if (!resp.result && typeof resp.result != 'undefined' && resp.result != 0) {
				this.button.hide = false;
				this.column.forEach((item, i) => {
					if(i==0){
						this.getLocation();
						this.column[i].disabled = true;
					}else if (i ==2){
						this.column[i].disabled = false;
						this.column[i].value=9
					}else{
						this.column[i].disabled = false;
						if(item.type == 'radio'){
							this.column[i].value=1
						}else {
							this.column[i].value= ''
						}
					}
					
				});
				// getCurrentPages()[getCurrentPages().length - 1].onLoad()
			} else {
				this.button.hide = true;
				this.column.forEach((item, i) => {
					this.column[i].disabled = true;
					this.column[i].value = resp.result[item.name];
				});
			}
		},
		//获取地理位置
		getLocation() {
			let that = this;
			let qqmapsdk = new QQMapWX({
				key: 'H5YBZ-66Y6F-SNVJW-NJWBI-TNYGZ-SRBDL'
			});
			uni.showLoading({
				title: '定位中...'
			});
			return new Promise((resolve, reject) => {
				uni.getLocation({
					type: 'gcj02',
					success: function(res) {
						//转译坐标=>地理位置
						qqmapsdk.reverseGeocoder({
							location: {
								latitude: res.latitude,
								longitude: res.longitude
							},
							success(res) {
								that.column[0].value = res.result.formatted_addresses.recommend;
							}
						});
						setTimeout(function() {
							uni.hideLoading();
						}, 1000);
						resolve(res);
					},
					async fail(res) {
						let scoped = await common.getSetting('scope.userLocation').catch(e => {
							return e;
						});
						if (!scoped) {
							//此时用户为授权地理位置
							uni.showModal({
								title: '提示',
								content: '您拒绝了定位权限，将无法使用考勤打卡功能,是否重新授权？',
								success(res) {
									if (res.confirm) {
										uni.openSetting({
											//打开微信设置页面
											success(res) {
												if (res.authSetting['scope.userLocation']) {
													//再次判断是否授权
													uni.getLocation({
														success: res => {
															qqmapsdk.reverseGeocoder({
																location: {
																	latitude: res.latitude,
																	longitude: res.longitude
																},
																success(res) {
																	that.column[0].value = res.result.formatted_addresses.recommend;
																}
															});
															setTimeout(function() {
																uni.hideLoading();
															}, 1000);
															resolve(res);
														}
													});
												} else {
													wx.showToast({
														title: '您拒绝了定位权限，将无法使用考勤打卡功能，请重新进入打卡页面进行授权！',
														icon: 'none'
													});
													that.column[0].value = '定位获取失败';
												}
											}
										});
									}
								}
							});
						}
					}
				});
			});
		},
		submitFun() {
			let params = {};
			this.column.forEach(item => {
				params[item.name] = item.value;
			});
			params.reportDate = this.date;
			// if(params.temperature!==''&&params.symptom!==''){
			// 	this.submitDisable = false
			// }
			this.$http
				.post({
					url: '/oa/healthReport/save',
					data: params
				})
				.then(e => {
					if (e.code == 0) {
						uni.showToast({
							title: '提交成功',
							icon: 'none'
						});
						uni.navigateBack();
					}
				});
		}
	},
	components: {
		baseForm,
		pickerModule
	},
	computed: {},
	watch: {
		date:{
			handler(){
				this.getRecord()
			}
		}
	}
};
</script>

<style lang="scss" scoped>
	.tips{
		width: 100%;
		padding: 10upx 20upx;
		color:red;
		background: yellow;
		}
.dateBox {
	view {
		display: flex;
		align-items: center;
	}
}
.arrow {
	width: 0;
	height: 0;
	border-right: 8upx solid transparent;
	border-left: 8upx solid transparent;
	border-top: 12upx solid #666;
	margin-left: 10upx;
}
.user {
	display: flex;
	justify-content: left;
	align-items: baseline;
	width: 100%;
	padding: 20upx;
	text {
		font-size: 36upx;
		font-family: Source Han Sans CN;
		font-weight: bold;
		color: rgba(51, 51, 51, 1);
		display: inline-block;
		margin-right: 20upx;
	}
	padding: 10upx 50upx;
	.dateBox {
		margin-right: 30upx;
	}
}
.refresh {
	position: absolute;
	left: 600upx;
	top: 90upx;
	padding: 8upx 16upx;
	border: 1upx solid #ccc;
	border-radius: 8upx;
	white-space: nowrap;
	font-size: 24upx;
	z-index: 99;
}
.formStyle {
	position: relative;
	view {
		text {
			color: blue !important;
		}
	}
}
</style>
